<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>js中事件的绑定</title>
</head>
<body>
    <input type="button" value="点击添加北京" onclick="addcitybg()">
    <input type="button" value="双击添加上海" ondblclick="addcitysh()">
    <input type="text" placeholder="请输入内容" id="usertext"/>
    <input type="button" value="添加用户输入信息" onclick="addusertext()">
    <ul id="city">

    </ul>
    <script type="text/javascript">
        function addcitybg(){
            var newtag=document.createElement("li")
            newtag.innerText="北京"
            var tag=document.getElementById("city")
            tag.appendChild(newtag)
        }
        function addcitysh(){
            var newtag=document.createElement("li")
            newtag.innerText="上海"
            var tag=document.getElementById("city")
            tag.appendChild(newtag)
        }
        function addusertext(){
            var usertag=document.getElementById("usertext")
            text=usertag.value //获取用户输入的内容的文本
            if(text.length>0){
                var newtag=document.createElement("li")
                newtag.innerText=text
                var tag =document.getElementById("city")
                tag.appendChild(newtag)
                //添加后将input框内容清空
                usertag.value=""
            }else{
                alert("请输入要添加的内容")
            }
        }


    </script>
</body>
</html>